/** @type {import('tailwindcss').Config} */

/*
* 生成衍生颜色css变量名（可以按照你们项目与设计师敲定的方案进行修改）
* @param {string} brandName 品牌名称 与 @/hooks/useTheme.js 中的brandName 对应
* */
function genSimilarColorsName(brandName) {
  return {
    lighter: `var(--${brandName}-lighter-color)`,
    light: `var(--${brandName}-light-color)`,
    DEFAULT: `var(--${brandName}-color)`,
    deep: `var(--${brandName}-deep-color)`,
    deeper: `var(--${brandName}-deeper-color)`
  };
}

module.exports = {
  content: [
    './index.html',
    './src/**/*.{vue,js,ts,jsx,tsx}'
  ],
  theme: {
    extend: {
      colors: {
        primary: genSimilarColorsName('primary'),
        success: genSimilarColorsName('success'),
        warning: genSimilarColorsName('warning'),
        danger: genSimilarColorsName('danger'),
        info: genSimilarColorsName('info')
      }
    },
  },
  plugins: [],
}

